<!-- 临时上道 -->
<div class="auto-build-page">
  <div nz-row>
    申请日期从：
    <nz-date-picker [(ngModel)]="queryParam._sDate" nzFormat="yyyy-MM-dd" [nzAllowClear]="'true'">
    </nz-date-picker>
    至：
    <nz-date-picker [(ngModel)]="queryParam._eDate" nzFormat="yyyy-MM-dd" [nzAllowClear]="'true'">
    </nz-date-picker>
    <button style="margin-left:10px;" nz-button nzType="primary" (click)="readyload(1,selectedValue)">查询</button>
  </div>
  <div nz-row>
    <div nz-col nzSpan="24">
      <button nz-button (click)="addModal()" nzType="primary">新增</button>
      <button (click)="editCheck()" nz-button nzType="primary">
        申请上道
      </button>
      <button *ngIf="userInfo.N_LEVEL==50" (click)="qianfaCheck()" nz-button nzType="primary">
        签发
      </button>
      <button *ngIf="userInfo.N_LEVEL==50" (click)="bohuiCheck()" nz-button nzType="primary">
        驳回
      </button>
      <button (click)="delCheck()" nz-button nzType="primary">
        删除
      </button>
      <button (click)="xiadaoCheck()" nz-button nzType="primary">
        申请下道
      </button>
    </div>
  </div>
  <div nz-row class="mt10 bgwhite">
    <nz-table #basicTable [nzScroll]="lockHeadScroll" [nzData]="tableData" [nzLoadingDelay]="1000" nzBordered
      [nzLoading]="tableLoading" [nzShowPagination]="false" [nzFrontPagination]="false" [nzNoResult]="''"
      nzSize="small">
      <thead>
        <tr>
          <th nzAlign="center" nzShowCheckbox nzWidth="50px" [nzIndeterminate]="indeterminate"
            [(nzChecked)]="allChecked" (nzCheckedChange)="checkAll($event)"></th>
          <th nzAlign="center" nzWidth="5%">序号</th>
          <th nzAlign="center" nzWidth="10%">执行部门</th>
          <th nzAlign="center" nzWidth="10%">命令号</th>
          <th nzAlign="center" nzWidth="8%">申请类型</th>
          <th nzAlign="center" nzWidth="8%">颜色</th>
          <th nzAlign="center" nzWidth="8%">状态</th>
          <th nzAlign="center" nzWidth="8%">申请时间</th>
          <th nzAlign="center" nzWidth="8%">受令人</th>
          <th nzAlign="center" nzWidth="8%">传达人</th>
          <th nzAlign="center">发令内容</th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let data of basicTable.data;index as i" (dblclick)="dblclick(data)" nz-tooltip
          nzTooltipTitle="双击查看详情" nzTooltipPlacement="bottom" style="cursor:pointer">
          <td nzShowCheckbox [(nzChecked)]="data.checked" (nzCheckedChange)="refreshStatus()">
          </td>
          <td nzAlign="center">{{+i + 1}}</td>
          <!-- 执行部门 -->
          <td nzAlign="center">{{data.vcReqdepname}}</td>
          <!-- 命令号 -->
          <td nzAlign="center">{{data.vcCodenum}}</td>
          <!-- 申请类型 -->
          <td nzAlign="center">{{data.vcReqtype == '1' ? '下道申请' : '上道申请'}}</td>
          <!-- 颜色 -->
          <td nzAlign="center">
            <span [class]="statusFollow(data.vcStatus)"></span>
          </td>
          <!-- 状态 -->
          <td nzAlign="center">{{status[data.vcStatus] || ''}}</td>
          <!-- 申请时间 -->
          <td nzAlign="center">{{data.dtCodedate | date:"yyyy-MM-dd"}}</td>
          <!-- 受令人 -->
          <td nzAlign="center">{{data.vcReqpersonname}}</td>
          <!-- 传达人 -->
          <td nzAlign="center">{{data.vcAppersonname}}</td>
          <!-- 发令内容 -->
          <td nzAlign="center">{{data?.vcCodeinfo}}</td>
        </tr>
      </tbody>
    </nz-table>
    <div class="pageWrap">
      每页
      <nz-select [(ngModel)]="selectedValue" (ngModelChange)="selectedChange()">
        <nz-option nzValue="10" nzLabel="10"></nz-option>
        <nz-option nzValue="50" nzLabel="50"></nz-option>
        <nz-option nzValue="100" nzLabel="100"></nz-option>
        <nz-option nzValue="200" nzLabel="200"></nz-option>
      </nz-select>
      条&nbsp;&nbsp;&nbsp;总共<span class="pageTotal">{{pageTotal}}</span>条
    </div>
    <div class="pageInation">
      <nz-pagination [nzPageSize]="selectedValue" [nzPageIndex]="pageIndexTable" [nzTotal]="pageTotal"
        (nzPageIndexChange)="rowChangeTable($event)"></nz-pagination>
    </div>
  </div>

  <!-- 新增页面 -->
  <ng-template #spModalFooter_add>
    <button nz-button nzType="primary" (click)="addCancel()">取消</button>
    <button nz-button nzType="primary" (click)="handleOk('add')">新增</button>
  </ng-template>
  <nz-modal [(nzVisible)]="addVisible" nzTitle="新增" nzWidth="1000px" [nzBodyStyle]="modalPanel.style"
    [nzFooter]="spModalFooter_add" (nzOnCancel)="addCancel()" class="zhrb">
    <div nz-row>
      <div nz-col nzSpan="24" class="title1">
        <span>昆明南电务段</span>
      </div>
    </div>
    <div nz-row>
      <div nz-col nzSpan="24" class="title2">
        <span>调度命令</span>
      </div>
    </div>

    <div nz-row>
      <div nz-col nzSpan="8">
        <span *ngIf="addData.vcCodenum">{{addData.vcCodenum}}</span>
      </div>
      <div nz-col nzSpan="8">
      </div>
      <div nz-col nzSpan="8">
        <span class="titleDate">{{addData.dtCodedate|date:"yyyy年MM月dd日"}}</span>
      </div>
    </div>
    <div nz-row>
      <div nz-col nzSpan="24">
        <table class="table">
          <tr>
            <td class="center text-label" style="width: 17%">发令时分</td>
            <td class="center text-label" style="width: 32%" colspan="2">受令执行部门</td>
            <td class="center text-label" style="width: 17%">受令人</td>
            <td class="center text-label" style="width: 17%">传达人</td>
            <td class="center text-label" style="width: 17%">备注</td>
          </tr>
          <tr>
            <td>
              <!-- 发令时分 -->
              <nz-time-picker [(ngModel)]="addData._dtCodetime" nzFormat="HH:mm">
              </nz-time-picker>
            </td>
            <td class="center" colspan="2">
              <ng-container *ngIf="userInfo.N_LEVEL==10; else ddbm">
                {{addData.vcReqdepname}}
              </ng-container>
              <ng-template #ddbm>
                <input nz-input [value]="addData.vcReqdepname||''" (click)="showDevSelect('add',selectDev_add)">
              </ng-template>
              <ng-template #selectDev_add>
                <div class="mb10" tabindex="1">
                  <nz-input-group nzAddOnBefore="车间">
                    <textarea #workshop_add nz-input [(ngModel)]="addData._cj" (click)="cjChange(workshop_add.value)"
                      (ngModelChange)="cjChange($event)" [nzAutocomplete]="auto_workshop_add"
                      nzAutosize="true"></textarea>
                    <nz-autocomplete #auto_workshop_add nzWidth="200px">
                      <nz-auto-option *ngFor="let opt of cjList_filter" [nzValue]="opt.opValue" [nzLabel]="opt.opName">
                        {{opt.opName}}
                      </nz-auto-option>
                    </nz-autocomplete>
                  </nz-input-group>
                </div>
                <div class="mb10">
                  <nz-input-group nzAddOnBefore="工区">
                    <textarea #workarea_add nz-input [(ngModel)]="addData._gq" (click)="gqClick('add')"
                      (ngModelChange)="gqChange($event)" [nzAutocomplete]="auto_workarea_add"
                      nzAutosize="true"></textarea>
                    <nz-autocomplete #auto_workarea_add nzWidth="200px">
                      <nz-auto-option *ngFor="let opt of gqList_filter" [nzValue]="opt.opValue" [nzLabel]="opt.opName">
                        {{opt.opName}}
                      </nz-auto-option>
                    </nz-autocomplete>
                  </nz-input-group>
                </div>
              </ng-template>
            </td>
            <td>
              <!-- 受令人 -->
              <textarea #person_add nz-input [(ngModel)]="addData.vcReqpersonid" (click)="slrChange('add')"
                (ngModelChange)="slrChange('add')" [nzAutocomplete]="auto_person_add" nzAutosize="true"></textarea>
              <nz-autocomplete #auto_person_add nzWidth="200px">
                <nz-auto-option *ngFor="let opt of slrList_filter" [nzValue]="opt.opValue" [nzLabel]="opt.opName">
                  {{opt.opName}}
                </nz-auto-option>
              </nz-autocomplete>
            </td>
            <td nzAlign="center">
              <!-- 传达人 -->
              <!-- {{addData.vcAppersonname}} -->
              <input nz-input disabled>
            </td>
            <td>
              <!-- 备注 -->
              <textarea nz-input [(ngModel)]="addData.vcBackup" [nzAutosize]="{ maxRows: 2 }"></textarea>
            </td>
          </tr>
          <tr>
            <td colspan="6">
              <p class="text-bold">发令内容：</p>
              <textarea nz-input [(ngModel)]="addData.vcCodeinfo" [nzAutosize]="{minRows:3 ,maxRows: 6 }"></textarea>
            </td>
          </tr>
          <tr>
            <td colspan="6">
              <p class="text-bold">要求：</p>
              <textarea nz-input [(ngModel)]="addData.vcCoderequ" [nzAutosize]="{minRows:4 ,maxRows: 6 }"></textarea>
            </td>
          </tr>
          <tr>
            <td class="text-label">签发</td>
            <!-- 某个需求要求发令人写死王进东 -->
            <td colspan="2">
              <input nz-input readonly [value]="addData.vcSigner||'王进东'">
            </td>
            <td class="text-label">发令人</td>
            <td colspan="2">
              <!-- {{addData.vcAppersonname}} -->
              <input nz-input disabled>
            </td>
          </tr>
        </table>
      </div>

    </div>

  </nz-modal>


  <!-- 申请页面 -->
  <ng-template #spModalFooter_edit>
    <button nz-button nzType="primary" (click)="editCancel()">取消</button>
    <button nz-button nzType="primary" (click)="editOk()">申请</button>
    <!-- <button *ngIf="userInfo.N_LEVEL==50" nz-button nzType="primary" (click)="editOk()">签发</button> -->
  </ng-template>
  <nz-modal [(nzVisible)]="editVisible" nzTitle="申请" nzWidth="1000px" [nzBodyStyle]="modalPanel.style"
    [nzFooter]="spModalFooter_edit" (nzOnCancel)="editCancel()" class="zhrb">
    <div nz-row>
      <div nz-col nzSpan="24" class="title1">
        <span>昆明南电务段</span>
      </div>
    </div>
    <div nz-row>
      <div nz-col nzSpan="24" class="title2">
        <span>调度命令</span>
      </div>
    </div>

    <div nz-row>
      <div nz-col nzSpan="8">
        <span *ngIf="editData.vcCodenum">{{editData.vcCodenum}}</span>
      </div>
      <div nz-col nzSpan="8">
      </div>
      <div nz-col nzSpan="8">
        <span class="titleDate">{{editData.dtCodedate|date:"yyyy年MM月dd日"}}</span>
      </div>
    </div>
    <div nz-row>
      <div nz-col nzSpan="24">
        <table class="table">
          <tr>
            <td class="center text-label" style="width: 17%">发令时分</td>
            <td class="center text-label" style="width: 32%" colspan="2">受令执行部门</td>
            <td class="center text-label" style="width: 17%">受令人</td>
            <td class="center text-label" style="width: 17%">传达人</td>
            <td class="center text-label" style="width: 17%">备注</td>
          </tr>
          <tr>
            <td>
              <!-- 发令时分 -->
              <nz-time-picker [(ngModel)]="editData._dtCodetime" nzFormat="HH:mm">
              </nz-time-picker>
            </td>
            <td class="center" colspan="2">
              <ng-container *ngIf="userInfo.N_LEVEL==10; else ddbm_sq">
                {{editData.vcReqdepname}}
              </ng-container>
              <ng-template #ddbm_sq>
                <input nz-input [value]="editData.vcReqdepname||''" (click)="showDevSelect('edit',selectDev_edit)">
              </ng-template>
              <ng-template #selectDev_edit>
                <div class="mb10" tabindex="1">
                  <nz-input-group nzAddOnBefore="车间">
                    <textarea #workshop_edit nz-input [(ngModel)]="editData._cj" (click)="cjChange(workshop_edit.value)"
                      (ngModelChange)="cjChange($event)" [nzAutocomplete]="auto_workshop_edit"
                      nzAutosize="true"></textarea>
                    <nz-autocomplete #auto_workshop_edit nzWidth="200px">
                      <nz-auto-option *ngFor="let opt of cjList_filter" [nzValue]="opt.opValue" [nzLabel]="opt.opName">
                        {{opt.opName}}
                      </nz-auto-option>
                    </nz-autocomplete>
                  </nz-input-group>
                </div>
                <div class="mb10">
                  <nz-input-group nzAddOnBefore="工区">
                    <textarea #workarea_edit nz-input [(ngModel)]="editData._gq" (click)="gqClick('edit')"
                      (ngModelChange)="gqChange($event)" [nzAutocomplete]="auto_workarea_edit"
                      nzAutosize="true"></textarea>
                    <nz-autocomplete #auto_workarea_edit nzWidth="200px">
                      <nz-auto-option *ngFor="let opt of gqList_filter" [nzValue]="opt.opValue" [nzLabel]="opt.opName">
                        {{opt.opName}}
                      </nz-auto-option>
                    </nz-autocomplete>
                  </nz-input-group>
                </div>
              </ng-template>
            </td>
            <td nzAlign="center">
              <!-- 受令人 -->
              <textarea #person_edit nz-input [(ngModel)]="editData.vcReqpersonid" (click)="slrChange('edit')"
                (ngModelChange)="slrChange('edit')" [nzAutocomplete]="auto_person_edit" nzAutosize="true"></textarea>
              <nz-autocomplete #auto_person_edit nzWidth="200px">
                <nz-auto-option *ngFor="let opt of slrList_filter" [nzValue]="opt.opValue" [nzLabel]="opt.opName">
                  {{opt.opName}}
                </nz-auto-option>
              </nz-autocomplete>
            </td>
            <td nzAlign="center">
              <!-- 传达人 -->
              {{editData.vcAppersonname}}
            </td>
            <td>
              <!-- 备注 -->
              <textarea nz-input [(ngModel)]="editData.vcBackup" [nzAutosize]="{ maxRows: 2 }"></textarea>
            </td>
          </tr>
          <tr>
            <td colspan="6">
              <p class="text-bold">发令内容：</p>
              <textarea nz-input [(ngModel)]="editData.vcCodeinfo" [nzAutosize]="{minRows:3 ,maxRows: 6 }"></textarea>
            </td>

          </tr>
          <tr>
            <td colspan="6">
              <p class="text-bold">要求：</p>
              <textarea nz-input [(ngModel)]="editData.vcCoderequ" [nzAutosize]="{minRows:4 ,maxRows: 6 }"></textarea>
            </td>
          </tr>
          <tr>
            <td class="text-label">签发</td>
            <td colspan="2">
              <input nz-input readonly [value]="editData.vcSigner||''">
            </td>
            <td class="text-label">发令人</td>
            <td colspan="2">
              {{editData.vcAppersonname}}
            </td>
          </tr>
        </table>
      </div>

    </div>

  </nz-modal>


  <!-- 查看页面 -->
  <ng-template #spModalFooter_detail>
    <button nz-button nzType="primary" (click)="detailCancel()">关闭</button>
    <ng-container *ngIf="shouldEdit">
      <button nz-button nzType="primary" (click)="handleOk('update')">保存</button>
    </ng-container>
  </ng-template>
  <nz-modal [(nzVisible)]="detailVisible" [nzTitle]="shouldEdit?'修改':'查看'" nzWidth="1000px"
    [nzBodyStyle]="modalPanel.style" [nzFooter]="spModalFooter_detail" (nzOnCancel)="detailCancel()" class="zhrb">
    <div nz-row>
      <div nz-col nzSpan="24" class="title1">
        <span>昆明南电务段</span>
      </div>
    </div>
    <div nz-row>
      <div nz-col nzSpan="24" class="title2">
        <span>调度命令</span>
      </div>
    </div>

    <div nz-row>
      <div nz-col nzSpan="8">
        <span *ngIf="detailData.vcCodenum">{{detailData.vcCodenum}}</span>
      </div>
      <div nz-col nzSpan="8">
      </div>
      <div nz-col nzSpan="8">
        <span class="titleDate">{{detailData.dtCodedate|date:"yyyy年MM月dd日"}}</span>
      </div>
    </div>
    <div nz-row>
      <div nz-col nzSpan="24">
        <table class="table">
          <tr>
            <td class="center text-label" style="width: 17%">发令时分</td>
            <td class="center text-label" style="width: 32%" colspan="2">受令执行部门</td>
            <td class="center text-label" style="width: 17%">受令人</td>
            <td class="center text-label" style="width: 17%">传达人</td>
            <td class="center text-label" style="width: 17%">备注</td>
          </tr>
          <tr>
            <td>
              <!-- 发令时分 -->
              <nz-time-picker [(ngModel)]="detailData._dtCodetime" nzFormat="HH:mm">
              </nz-time-picker>
            </td>
            <td class="center" colspan="2">
              <!-- 受令执行部门 -->
              <ng-container *ngIf="shouldEdit; else onlyScanDep">
                <ng-container *ngIf="userInfo.N_LEVEL==10; else scanInp">
                  {{detailData.vcReqdepname}}
                </ng-container>
                <ng-template #scanInp>
                  <input nz-input [value]="detailData.vcReqdepname||''"
                    (click)="showDevSelect('detail',selectDev_scan)">
                </ng-template>
                <ng-template #selectDev_scan>
                  <div class="mb10" tabindex="1">
                    <nz-input-group nzAddOnBefore="车间">
                      <textarea #workshop_add nz-input [(ngModel)]="detailData._cj"
                        (click)="cjChange(workshop_add.value)" (ngModelChange)="cjChange($event)"
                        [nzAutocomplete]="auto_workshop_add" nzAutosize="true"></textarea>
                      <nz-autocomplete #auto_workshop_add nzWidth="200px">
                        <nz-auto-option *ngFor="let opt of cjList_filter" [nzValue]="opt.opValue"
                          [nzLabel]="opt.opName">
                          {{opt.opName}}
                        </nz-auto-option>
                      </nz-autocomplete>
                    </nz-input-group>
                  </div>
                  <div class="mb10">
                    <nz-input-group nzAddOnBefore="工区">
                      <textarea #workarea_add nz-input [(ngModel)]="detailData._gq" (click)="gqClick('edit')"
                        (ngModelChange)="gqChange($event)" [nzAutocomplete]="auto_workarea_add"
                        nzAutosize="true"></textarea>
                      <nz-autocomplete #auto_workarea_add nzWidth="200px">
                        <nz-auto-option *ngFor="let opt of gqList_filter" [nzValue]="opt.opValue"
                          [nzLabel]="opt.opName">
                          {{opt.opName}}
                        </nz-auto-option>
                      </nz-autocomplete>
                    </nz-input-group>
                  </div>
                </ng-template>
              </ng-container>
              <ng-template #onlyScanDep>
                <textarea nz-input [(ngModel)]="detailData.vcReqdepname" [nzAutosize]="{ maxRows: 4 }"
                  [readonly]="!shouldEdit"></textarea>
              </ng-template>
            </td>
            <td nzAlign="center">
              <!-- 受令人 -->
              <ng-container *ngIf="shouldEdit; else onlyScanPer">
                <!--                <ng-container *ngIf="userInfo.N_LEVEL!=10; else ddslr_scan">-->
                <textarea #person_add nz-input [(ngModel)]="detailData.vcReqpersonid" (click)="slrChange('detail')"
                  (ngModelChange)="slrChange('detail')" [nzAutocomplete]="auto_person_add" nzAutosize="true"></textarea>
                <nz-autocomplete #auto_person_add nzWidth="200px">
                  <nz-auto-option *ngFor="let opt of slrList_filter" [nzValue]="opt.opValue" [nzLabel]="opt.opName">
                    {{opt.opName}}
                  </nz-auto-option>
                </nz-autocomplete>
              </ng-container>
              <ng-template #onlyScanPer>
                <textarea nz-input [(ngModel)]="detailData.vcReqpersonname" [nzAutosize]="{ maxRows: 2 }"
                  [readonly]="!shouldEdit"></textarea>
              </ng-template>
            <td nzAlign="center">
              <!-- 传达人 -->
              <textarea nz-input [(ngModel)]="detailData.vcAppersonname" [nzAutosize]="{ maxRows: 2 }"
                readonly></textarea>
            </td>
            <td>
              <!-- 备注 -->
              <textarea nz-input [(ngModel)]="detailData.vcBackup" [nzAutosize]="{ maxRows: 2 }"
                [readonly]="!shouldEdit"></textarea>
            </td>
          </tr>
          <tr>
            <td colspan="6">
              <p class="text-bold">发令内容：</p>
              <textarea nz-input [(ngModel)]="detailData.vcCodeinfo" [nzAutosize]="{minRows:3 ,maxRows: 6 }"
                [readonly]="!shouldEdit"></textarea>
            </td>
          </tr>
          <tr>
            <td colspan="6">
              <p class="text-bold">要求：</p>
              <textarea nz-input [(ngModel)]="detailData.vcCoderequ" [nzAutosize]="{minRows:4 ,maxRows: 6 }"
                [readonly]="!shouldEdit"></textarea>
            </td>
          </tr>
          <tr>
            <td class="text-label">签发</td>
            <td colspan="2">
              <input nz-input readonly [value]="detailData.vcSigner||''">
            </td>
            <td class="text-label">发令人</td>
            <td colspan="2">
              {{detailData.vcAppersonname}}
            </td>
          </tr>
        </table>
      </div>
    </div>
  </nz-modal>
</div>